<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="../../../views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>新增团队</title>
<head>
    <meta charset="utf-8">
    <title>新增团队</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <link rel="stylesheet" href="/fdoctor-ms/statics/beginnerAdmin/plugins/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="/fdoctor-ms/statics/beginnerAdmin/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/fdoctor-ms/statics/beginnerAdmin/css/btable.css" />
    
    <script type="text/javascript" src="/fdoctor-ms/statics/beginnerAdmin/plugins/layui/layui.js"></script>
    <script type="text/javascript" src="/fdoctor-ms/statics/js/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" src="/fdoctor-ms/statics/js/inputTools.js"></script>
    
</head>

<body>
	<fieldset class="layui-elem-field layui-field-title" style="margin-top: 5px;margin-left: 5px;margin-right: 5px">
	  <legend>新增团队
	  </legend>
	</fieldset>
	<form class="layui-form" action="" id="dataForm">
		<div class="layui-form-item" style="width: 90%">
			<label class="layui-form-label" > 医院：</label>
			    <div class="layui-input-inline" ">
			      	<select name="orgId" id="orgId" lay-search lay-filter="orgId">
						<option value="" style="width: 190px;">可输入医院名搜索</option>
						<option value="0" >全部</option>
							<c:forEach items="${hospitalList}" var="hospitalItem">
								<option value="${hospitalItem.id}">${hospitalItem.orgName}</option>
							</c:forEach>
					</select>  
			    </div>
			<hr>
		</div>
		<div class="layui-btn-group">
			<button class="layui-btn layui-btn-primary layui-btn-small" id="addButton" type="button"><i class="layui-icon">&#xe654;</i>增加</button>
		</div>
		<div class="layui-form-item" style="width: 90%">
			<table class="layui-table" id="itable">
				
				<thead>
				  <tr>
				    <th style="width:100px;">医生类型</th>
				    <th style="width:100px;">医生</th>
				    <th style="width:120px;">队长标识</th>
				    <th style="width:40px;">操作</th>
				  </tr> 
				</thead>
				<tbody id="tab11">
					
				</tbody>
			</table>
		</div>
		
		<hr>
		
		<hr>
	  <div align="center">
	  		<button class="layui-btn layui-btn-big layui-btn-primary layui-btn-radius" type="button" id="saveButton"><i class="layui-icon">&#xe618;</i>确认保存</button>
	  </div>
	</form>
	  
</body>

<script type="text/javascript">
	//初始化表单控件
layui.use(['jquery', 'form','laydate'], function() {
	$ = layui.jquery;
	form = layui.form();
	var laydate = layui.laydate;
	
	 var addlist='<tr><td><select name="docType" id="docType" lay-filter="docType">'
		+ '							<option value="0">医生类型</option>'	
		+ '							<option value="1">医生</option>'
		+ '							<option value="2">公卫医生</option>'
		+ '							<option value="3">护士</option>'
		+ '				</select></td>'
		+ '				<td><select name="docId" id="docId" lay-filter="docId">'
		+ '							<option value="" style="width: 190px;">请选择医生</option>'
		+ '						</select></td>'
		+ '				<td><input type="radio" name="leader"  title="设置为队长" lay-filter="leader"></td>'	
		+ '				<td><a href="javascript:void(0)"  class="deletetr" > 删除</a></td>'
		+ '			</tr>';
		$("#tab11").append(addlist);
		form.render(); 
	
	$('#addButton').on('click',function(){
		orgId=$('#orgId').val();
		if(orgId==null || orgId==''){
			layer.msg('请先选择医院！',{icon: 7});
    		return;
		}
		var addlist='<tr><td><select name="docType" id="docType" lay-filter="docType">'
			+ '							<option value="0">医生类型</option>'	
			+ '							<option value="1">医生</option>'
			+ '							<option value="2">公卫医生</option>'
			+ '							<option value="3">护士</option>'
			+ '				</select></td>'
			+ '				<td><select name="docId" id="docId" lay-filter="docId">'
			+ '							<option value="" style="width: 190px;">请选择医生</option>'
			+ '						</select></td>'
			+ '				<td><input type="radio" name="leader"  title="设置为队长" lay-filter="leader"></td>'	
			+ '				<td><a href="javascript:void(0)"  class="deletetr" > 删除</a></td>'
			+ '			</tr>';
			$("#tab11").append(addlist);
			form.render();
	})
	
	$(document).on('click', '.deletetr', function(){
  		var tr=$(this).parent().parent();
  		
  		tr.remove();
  		form.render();
	})
	
    $('#saveButton').on('click',function(){
    	var leaderList=$("input[name='leader']");
    	var leader="";
    	for(i=0;i<leaderList.length;i++){
    		if(leaderList[i].checked){
    			var leader=leaderList[i].value;
    		}
    	}
    	if(leader==""){
    		layer.msg('请任命任一人为队长！',{icon: 7});
    		return;
    	}
    	
    	
    	layer.confirm('确认保存？', {icon: 3, title:'提示'}, function(index){
			layer.close(index);
			$.ajax({
				type : 'POST',
				url : '/fdoctor-ms/team/saveTeam',
				data : packParams(),
				success : function(data) {
					if (data.code == 200) {
						var index = parent.layer.getFrameIndex(window.name);
						parent.layer.close(index);
						parent.layer.msg('保存成功！', {
							icon : 1
						});
						parent.tableConfig();
					} else {
						parent.layer.msg('保存失败！'+data.msg, {
							icon : 2
						});
					}
				}
			});
		});
    });
	
	form.on('select(docType)', function (data) {
		var that=$(this).parents()[3].cells[1];
		orgId=$('#orgId').val();
		if(orgId==null || orgId==''){
			layer.msg('请先选择医院！',{icon: 7});
	    	return;
		}	
	    if(data.value != '0'){
	    	
	    	$.ajax({
			 			type : 'GET',
			 			url : '/fdoctor-ms/team/getDocTypeList',
			 			data :{
			 				orgId:orgId,
			 				docType:data.value
			 			},
			 			success : function(data) {
			 				$(that).html('');
			 				var html='<select name="docId" id="docId" lay-filter="docId" >';
			 				var  html1=html+'<option value="">--请选择医生--</option>';
			 				var proHtml = '';
			 				var proHtmlend = '';
			 				for(i = 0; i < data.length; i++){
			 					proHtml =proHtml + '<option value="'+data[i].id+'">'+data[i].docName+'</option>';
			 					
			 				}
			 				var htmlend='</select>';
			 				proHtmlend=html1+proHtml+htmlend
			 				$(that).append(proHtmlend)
			 				form.render();
			 			}
			 	});
		  }else{
			  
			  $('#docId').html('<option value="">--请先选择医生种类--</option>');
	   		 form.render();
	    }
	})
	
	
	    
    function packParams(){
		var sdEntity=[];
    	var leaderList=$("input[name='leader']");
    	var docTypeList=$("select[name='docType']");
    	var docIdList=$("select[name='docId']");
    	for(i=0;i<docTypeList.length;i++){
    		var sd={};
    		sd.docType=docTypeList[i].value;
    		sd.docId=docIdList[i].value;
    		if(leaderList[i].checked){
    			sd.leaderFlag='1';
    		}else{
    			sd.leaderFlag=null;
    		}
    		sdEntity.push(sd);
    	}
    	var param = {
				sden:JSON.stringify(sdEntity)
		}
		return param;
	}
})
    
    

    
</script>
</html>